<template>
	<div class="tmpl">
		<ul class="mui-table-view mui-table-view-chevron">
			<!--
				<li class="mui-table-view-cell mui-media" :key="index">
					<a class="mui-navigate-right">
						<img class="mui-media-object mui-pull-left" src="../../static/img/cbd.jpg">
						<div class="mui-media-body">
							CBD
							<span class="mui-pull-right">点击:9</span>
							<span class="mui-pull-right">12-05 11:05:10&nbsp;&nbsp;&nbsp;&nbsp;</span>
							<p class='mui-ellipsis'>烤炉模式的城，到黄昏，如同打翻的调色盘一般.</p>
						</div>
					</a>
				</li>
			-->
			<nav-bar-vue title="新闻列表"></nav-bar-vue>
			<li class="mui-table-view-cell mui-media" v-for="(news, index) in newsList" :key="index">
				<router-link class="mui-navigate-right" :to="{name:'news.detail', query:{id:news.id}}">
					<img class="mui-media-object mui-pull-left" src="../../static/img/shuijiao.jpg">
					<div class="mui-media-body">
						{{news.title}}
						<span class="mui-pull-right">点击:{{news.clickCount}}</span>
						<span class="mui-pull-right">{{news.createTime | convertDate}}&nbsp;&nbsp;&nbsp;&nbsp;</span>
						<p class='mui-ellipsis'>{{news.shortDesc}}</p>
					</div>
				</router-link>
			</li>
		</ul>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				newsList: [], // 新闻列表数据
			}
		},
		created() {
			//			this.$axios.get("getnewslist").then(res ==> {
			//				
			//			}).catch(err => {
			//				
			//			});
			for(var i = 0; i < 10; i++) {
				let item = {
					id:i,
					title: "新闻标题",
					shortDesc: "新闻简介",
					createTime: new Date(),
					clickCount: "115",
				};
				this.newsList.push(item);
			}

		}
	}
</script>

<style scoped>
	.mui-media-body span {
		font-size: 8px;
		color: dodgerblue;
	}
</style>